<template>
  <div class="label-print-box" :style="canvasStyle()">
    <Elements
      v-for="item in elements"
      :info="item"
      :labelNumber="props.info.labelNumber"
      :BusinessElementText="
        info.isTest
          ? setTestBusinessTest(item)
          : setBusinessElementText(item, info.jsonObj || JSON.parse(info.labelJson))
      "
    />
  </div>
</template>

<script lang="ts" setup>
import Elements from '../Element.vue'
import { setBusinessElementText, setTestBusinessTest } from '../form'
import { setNewelement } from '../mm2px'
const props = defineProps<{
  info: any
  designData: any
}>()

let { canvas, elements } = JSON.parse(props.designData)
if (canvas.childCanvas1) {
  elements = setNewelement(elements)
}

const canvasStyle = () => {
  const { width, height } = canvas
  return {
    width: width * 2 + 'mm',
    height: height * 2 + 'mm'
  }
}
</script>

<style lang="less" scoped>
.label-print-box {
  border: 1px solid #ddd;
  background: #fff;
  position: relative;
  overflow: hidden;
  .moveable-el {
    position: absolute;
  }
}
</style>
